var SoundSystem = function(soundManager, systemName, sources, div) {
	this.soundManager = soundManager;
	this.name = systemName;
	this.sources = sources;
	this.div = document.createElement("div");
	div.appendChild(this.div);
	this.div.className = "system-section";

	this.createUI();
	this.selectSource();
};

SoundSystem.prototype.createUI = function() {
	this.div.innerHTML = "";
	var header = document.createElement("h4");
	header.innerText = this.name;
	header.className = "system-header";
	this.div.appendChild(header);
	this.sourceSelector = document.createElement("select");
	this.sourceSelector.className = "source-selector";
	this.sourceSelector.onchange = this.selectSource.bind(this);
	this.div.appendChild(this.sourceSelector);
	
	this.addSources();
	
	this.pandoraChannels = document.createElement("select");
	this.pandoraChannels.className = "pandora-selector";
	this.div.appendChild(this.pandoraChannels);
	this.pandoraChannels.style.display = "none";
	
	this.playButton = document.createElement("button");
	this.playButton.innerText = "Play";
	this.playButton.className = "button";
	this.playButton.onclick = this.play.bind(this);
	this.div.appendChild(this.playButton);
	this.pauseButton = document.createElement("button");
	this.pauseButton.innerText = "Pause";
	this.pauseButton.onclick = this.pause.bind(this);
	this.div.appendChild(this.pauseButton);
	this.div.appendChild(document.createElement("hr"));
};


SoundSystem.prototype.addSources = function() {
	for (i in this.sources) {
		this.sourceSelector.add(new Option(this.sources[i], this.sources[i]));
	}
	
	this.sourceSelector.add(new Option("Pandora", "Pandora"));
};


SoundSystem.prototype.pause = function() {
	this.soundManager.pause(this.name);
};

SoundSystem.prototype.play = function() {
	console.log("playing");
	if (this.sourceSelector.value == "Pandora") {
		this.soundManager.playPandoraStation(this.name, this.pandoraChannels.value);
	} else {
		this.soundManager.playAudioSource(this.name, this.sourceSelector.value);
	}
};

SoundSystem.prototype.selectSource = function() {
	var source = this.sourceSelector.value;
	console.log("Selecting source " + source);
	if (source == "Pandora") {
		this.soundManager.requestPandoraStations(this.name);
		this.pandoraChannels.style.display = '';
	} else {
		this.pandoraChannels.style.display = "none";
	}
};


SoundSystem.prototype.setPandoraStations = function(stations) {
	this.pandoraChannels.innerHTML = "";
	console.log(stations);
	for (i in stations) {
		console.log(stations[i]);
		this.pandoraChannels.add(new Option(stations[i], stations[i]));
	}
};



